import React from 'react'
// ===================================================================== Image
// import sysImg 	from '@img/quality/sys.png'
import pImg 	from '@img/quality/p.png'
import csImg 	from '@img/quality/cs.png'
import cszImg 	from '@img/quality/csz.png'
// import dcszImg 	from '@img/quality/dcsz.png'
import ljtImg 	from '@img/quality/ljt.png'
// import dljtImg 	from '@img/quality/dljt.png'
import spcgzImg from '@img/quality/spcgz.png'
// ===================================================================== global declare
// const { $fn } = window

class Index extends React.Component {
	
	btns = () => {
		const that = this.props.thisRef
		return [
			// { label: '实验室', src: sysImg, onClick: () => { console.log(1) } },
			// { label: '批', src: pImg, onClick: () => { that.pModalRef.open(that) }, disabled: that.type === 0 ? !$fn.hasObject(that.pRow) : true},
			// { label: '测试', src: csImg, onClick: () => { that.testModalRef.open(that.pRow, that.cRow, that.pageRef) }, disabled: that.type === 1 ? !$fn.hasObject(that.cRow) : true },
			{ label: '分析批', src: pImg, onClick: () => { that.pModalRef.open(that) } },
			{ label: '测试', src: csImg, onClick: () => { that.testModalRef.open(that) }, disabled: that.pRow?.id ? false : true },
			{ label: '测试组', src: cszImg, onClick: () => { that.groupModalRef.open() }, disabled: that.pRow?.type === 'group' ? false : true },
			// { label: '多个测试组', src: dcszImg, onClick: () => { console.log(5) } },
			{ label: 'L-J图', src: ljtImg, onClick: () => {
				if (that.pageRef.state.index === 2) {
					that.pageRef.page2Ref.refs.ref.info()
				} else {
					that.pageRef.setState({index: 2})
				}
			}, disabled: that.cRow?.id ? false : true },
			// { label: '多项目LJ图', src: dljtImg, onClick: () => { console.log(7) } },
			{ label: 'SPC规则', src: spcgzImg, onClick: () => that.ruleModalRef.open(that.cRow), disabled: that.cRow?.analyte_name ? false : true },
		]
	}

	render(){
		return <div className='fx bcf r5px mtb5'>
			{ this.btns().map(({src, label, disabled, onClick}, i) => <div key={i} className={disabled ? 'bad fv xm ptb5 r5px cp mr5' : 'btn fv xm ptb5 r5px cp mr5'} onClick={ () => !disabled && onClick()}>
				<img src={src} alt='' />
				<span className='mt5'>{label}</span>
			</div>) }
		</div>
	} 
}

export default Index